<template>
    <div class="map">
        <xlTable
                :columns="columns"
                :dataSource="data"
                rowKey="id"
                :pagination="pagination"
                :loading="loading"
                @change="handleTableChange"
                bordered
                :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}">
            >
            <template v-slot:action="scope">
                <a @click="editForm(scope.record)">编辑</a>
                <a-divider type="vertical"/>
                <a-dropdown>
                    <a class="ant-dropdown-link">更多 <a-icon type="down"/></a>
                    <a-menu slot="overlay">
                        <a-menu-item @click="seeForm(scope.record)">
                            <a>查看</a>
                        </a-menu-item>
                        <a-menu-item>
                            <a-popconfirm title="确定删除吗?" @confirm="() => delForm(scope.record.id)">
                                <a>删除</a>
                            </a-popconfirm>
                        </a-menu-item>
                    </a-menu>
                </a-dropdown>
            </template>
        </xlTable>
        <xlForm ref="xlForm" @handleOk="handleOk"></xlForm>
        <seeForm ref="seeForm"></seeForm>
    </div>
</template>

<script>
    import xlMixin from '../../mixin/index'
    import {mapResourceGet} from "../../../assets/api";
    export default {
        name: "index",
        mixins:[xlMixin],
        data(){
            return{
                columns:[],
                url: {
                    list: "/system/api/map/resource/page/list",
                    add: '/system/api/map/resource/tag/save',
                    edit: '/system/api/map/resource/tag/save',
                    delete: "/system/api/map/resource/tag/remove",
                    deleteBatch: "/ndo/api/ndo/hatch/company/remove",
                    exportXlsUrl: "/ndo/api/new/dev/org/export/team/members",
                    importExcelUrl: "/person/project/upload/cjjn"
                }
            }
        },
        watch:{
            resourceTagCode(){
                this.paramMore.resourceTagCode = this.resourceTagCode
                this.paramMore.resourceTagIdArray = [this.tagId]
                this.formatMerge()
                this.pageOnload()
            }
        },
        props:{
            resourceTagCode:String,
            tagList:{
                type:Array,
                default:()=>{
                    return []
                }
            },
            tagId:Number
        },
        created(){
            this.paramMore.resourceTagCode = this.resourceTagCode
            this.paramMore.resourceTagIdArray = [this.tagId]
            this.columns = [
                {
                    title: '序号排序',
                    key: 'rowIndex',
                    align: "center",
                    fixed: 'left',
                    width:'180px',
                    sorter: (a) => a.id,//排序
                    customRender: function (t, r, index) {
                        return parseInt(index) + 1;
                    }
                },
                {
                    title: '资源名称',
                    dataIndex: 'resourceName',
                    fixed: 'left',
                    type:'input',
                    formVisible:true
                },
                {
                    title: '资源名称',
                    dataIndex: 'resourceId',
                    type:'select',
                    typeData:this.tagList.map(item=>{
                        return {
                            dataName:item.resourceName,
                            dataValue:item.id
                        }
                    }),
                    span:2
                },
                {
                    title: '坐标信息',
                    dataIndex: 'lng',
                    type:'input',
                    formVisible:true
                },
                {
                    title: '坐标信息',
                    dataIndex: 'lat',
                    type:'input',
                    formVisible:true
                },
                {
                    title: '资源标签',
                    dataIndex: 'mapResourceTagList',
                    type:'input',
                    span:2,
                    formVisible:true
                },
                {
                    title: '资源类型',
                    dataIndex: 'resourceType',
                    type:'select',
                    formVisible:true,
                    typeData:[
                        {
                            dataName:'名企',
                            dataValue:'2'
                        },
                        {
                            dataName:'载体',
                            dataValue:'3'
                        },{
                            dataName:'新研',
                            dataValue:'4'
                        }
                    ]
                },
                {
                    title: '资源联系人',
                    dataIndex: 'contacts',
                    type:'input',
                    formVisible:true
                },
                {
                    title: '资源联系人电话',
                    dataIndex: 'contactsNumber',
                    type:'input',
                    formVisible:true
                },
                {
                    title: '明细地址',
                    dataIndex: 'detailUrl',
                    type:'input',
                    formVisible:true
                },
                {
                    title: '资源地址',
                    dataIndex: 'resourceAddress',
                    type:'input',
                    span:2,
                    formVisible:true
                },
                {
                    title: '宣传图',
                    dataIndex: 'imageUrl',
                    type:'upload',
                    span:2,
                    required:false,
                    formVisible:true
                },
                {
                    title: '资源描述',
                    dataIndex: 'resourceContext',
                    type:'textarea',
                    span:2,
                    formVisible:true
                },
                {
                    title: '操作',
                    dataIndex: 'action',
                    align: "center",
                    fixed: 'right',
                    width:'150px',
                    scopedSlots: {customRender: 'action'},
                }
            ]
            this.formatMerge()
            this.pageOnload()
        },
        methods:{
            seeForm(data) {
                // 查看方法触发
                mapResourceGet({
                    param:data.id
                })
                    .then(result=>{
                        this.$refs.seeForm.formatData(this.columns, result.result)
                        this.$refs.seeForm.visible = true
                    })
            }
        }
    }
</script>

<style scoped lang="less">
    .map{
        width: 100%;
        .xl-table-content{
            padding: 16px;
            width: 100%;
        }
    }
</style>
